﻿<%@ page import="java.util.Date" %><%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2016/8/22
  Time: 11:30
  To change this template use File | Settings | File Templates.
--%>
<%
    String tag = request.getSession().getAttribute("tag")+"";
    String targetId= request.getSession().getAttribute("targetId")+"";
%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <title>新途加油新西兰</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="/static/bootstrap-3.3.5/css/bootstrap.min.css">
    <link rel="stylesheet" href="index.css">
    <script src="${cdnContentPath}/static/jquery/jquery-3.1.0.min.js"></script>
    <script src="${cdnContentPath}/static/bootstrap-3.3.5/js/bootstrap.min.js"></script>
    <style>
        body {
            background: #2C3243;
        }
    </style>
</head>
<body>
<img src="../img/background.png" style="width:100%;height:100%;position: absolute;z-index: -1">
<div class="main">
    <div class="head">
        <div class="head-img">
            <img class="frame" src="../img/blue-2x.png" alt="加载错误">
            <img class="img" id="head-img" src="../img/headimg.png" alt="加载错误">
        </div>
    </div>
    <div class="head-text">
        <span>到达新西兰即可获得现金大奖</span>
    </div>
    <div class="height-40"></div>
    <div class="head juli">
        <img class="ticket" id="ticket" src="../img/ticket-2x.png">
        <span class="body-text">我</span>
        <div class="energy radius" id="energy">
            <div class="value radius"></div>
        </div>
        <img class="house" src="../img/house-2x.png">
        <span class="body-text" style="" id="new-text">新西兰</span>
    </div>
    <div style="height:10px"></div>
    <div class="head-text">
        <span>对方已经飞了<span id="rest">0</span>公里，还有<span id="restD">8000</span>公里即可抽取大奖</span>
    </div>
    <div class="height-40"></div>
    <div style="width:60%;margin:0 auto">
        <img src="../img/buttom2-2-2x.png" style="width:100%;" id="bottom-1"/>
        <img src="../img/buttom2-1-2x.png" style="width:100%;display: block;z-index: 999999;" id="bottom-2"/>
    </div>
    <div class="height-40"></div>
    <div class="head-text" style="color:#E3B540">
        <span>前三位到达的即可获得新途微助手600元现金券</span><br/>
        <span>其余参与者皆可获得丰富的礼物</span>
    </div>
</div>
<script type="text/javascript">
    $(document).ready(function () {
        var tag = "<%=tag%>";//验证标记
        var title = '新途加油新西兰';
        var desc = '您的好友正在前往新西兰，快来给他加油。';
        var username  ;
        var restD;
        var imgUrl;
        var link = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx1a5d74a8c7cb135e&redirect_uri=http%3a%2f%2fweixin.mulanweb.com%2fmulanweb%2fevent%2froute&response_type=code&scope=snsapi_base&state=t2t_<%=targetId%>#wechat_redirect';
        //获取详情信息
        $.post("/mulanweb/event/getDetailPage",{tag:tag},function(info){
            title = info.title;
            desc = info.desc;
            username = info.username;
            imgUrl = info.headImg;
            restD =  info.restD;
            $("#restD").html(restD);
            $("#rest").html(8000-restD);
            $("#head-img").attr("src",imgUrl);
            var restJL = (1-restD/ 8000)*100;
            $(".value").width(restJL+"%");
        });

        var amountWidth =  $(".juli").width();
        var lessWidth = $(".ticket").width() + $(".house").width();
        var spanWidth = $("#new-text").width();
        var lastValue = amountWidth - lessWidth;
        var lastResult = lastValue-spanWidth;
        $("#energy").width(lastResult+10);
        $("#new-text").css('left',(lastValue/amountWidth)*100 +"%");
        $("#bottom-1").on("click",function(){
            startTP();
        });
        $("#bottom-2").on("click",function(){
            startCJ();
        });

        function startTP(){
            // 开始投票
            $.post("/mulanweb/event/startVote",{tag:tag},function(info){
                var value = info.value;
                var username = info.username ;
                var couponCode = info.couponCode;
                if(info.ReturnCode ==1){
                    alert("您为"+ username +"飞了"+value+"公里"+"；感谢您参加此活动，新途微助手为您准备了一张新西兰景点门票优惠券（券码:"+couponCode+"),仅支持在新途微助手中使用，谢谢");
                }else{
                    alert(info.AlertMessage||"操作失败");
                }
            })
        }

        function startCJ(){
            // 开始参加活动
            $.post("/mulanweb/event/create2",{},function(info){
                if(info.ReturnCode == 1){
                    alert("参加成功");
                    window.location.href = info.DataList;
                }else{
                    alert(info.AlertMessage|| "操作失败");
                }
            })
        }
    })
</script>
</body>
</html>
